// 写一个初始化函数
// 把数组的每一项渲染到新建的dom元素中
function createListItems () {
    for (const item of hot) {
        // 创建元素
        const el = $(`
            <div class="nav-item" style="height: ${ 100 / hot.length }%">
                ${ item.city } ${ num2thousand(item.value) } (${ item.isDesc ? '下降' : '上升' })
            </div>
        `);
        $('.nav').append(el);
    }
    $('.nav-item').on('mouseover', function (e) {
        e.stopPropagation();
        const index = $(this).index();
        currentIndex = index;
        // 动态创建intro中的内容
        createIntroContent(currentIndex);
        $(this).addClass('active').siblings().removeClass('active');
    });
}

function createIntroContent (idx) {
    const container = $('.intro');
    container.html('');
    const currentDataItem = hot[idx];
    for (const item of currentDataItem.detail) {
        const el = $(`
            <div style="height: ${ 100 / currentDataItem.detail.length }%">
                ${ item.goodsName } ${ num2thousand(item.value) } (${ item.isDesc ? '下降' : '上升' })
            </div>
        `);
        container.append(el);
    }
}

function run () {
    timer = setTimeout(function () {
        $('.nav-item').eq(currentIndex % hot.length).trigger('mouseover');
        currentIndex++;
        // 在setTimeout结束后继续启用setTimeout  达到interval的效果
        run();
    }, 1000);
}

let currentIndex = 1;
let timer = null;

createListItems();
createIntroContent(0);
run();

$('.nav-item').eq(0).addClass('active');

$('.rank-wrapper').on('mouseover', function (e) {
    clearTimeout(timer);
});

$('.rank-wrapper').on('mouseleave', run);

function getSum (nums) {
    let sum = 0;
    for (const num of nums) {
        sum += num;
    }
    return sum;
}

const 可爱多 = getSum(hot.map(function (item) {
    return item.detail[0].value;
}));

const 娃哈哈 = getSum(hot.map(function (item) {
    return item.detail[1].value;
}));

const 喜之郎 = getSum(hot.map(function (item) {
    return item.detail[2].value;
}));

// ...


// const 娃哈哈 = hot.map(function (item) {
//     return item.detail[1].value;
// }).reduce(function (prev, current) {
//     return prev + current;
// });

// console.log(娃哈哈)

// const 期待的数组 = [
//     { name: '可爱多', sum: 123412412 },
//     { name: '可爱多', sum: 123412412 },
//     { name: '可爱多', sum: 123412412 },
//     { name: '可爱多', sum: 123412412 },
//     { name: '可爱多', sum: 123412412 },
//     { name: '可爱多', sum: 123412412 },
// ];

// const 结果数组 = hot[0].detail.map(function (item, idx) {
//     return {
//         name: item.goodsName,
//         sum: getSum(hot.map(function (item) {
//             return item.detail[idx].value;
//         })),
//     };
// }).sort(function (a, b) {
//     return b.sum - a.sum;
// });

// console.log(结果数组);
